<!--
 * @Author: yangsongzhu 422540054@qq.com
 * @Date: 2023-12-12 10:27:20
 * @LastEditors: yangsongzhu 422540054@qq.com
 * @LastEditTime: 2023-12-12 10:49:12
 * @FilePath: \test\my-test-protect\src\components\SvgIcon\index.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <div>
    <svg :class="{ currentColor }" class="svg-icon" :style="{ width: size + 'px', height: size + 'px' }">
      <use :xlink:href="`#icon-${name}`" />
    </svg>
  </div>
</template>
   
<script setup lang="ts">
// 接受父组件传递过来得参数
defineProps({
  name: {
    type: String,
    required: true,
    default: "car",
  },
  size: {
    type: Number,
    default: 20,
  },
  currentColor:{
    type: Boolean,
    default: true,
  }
});

</script>
<style  lang="scss" scoped>
.svg-icon {
  vertical-align: -0.15em;
  fill: currentColor;
  overflow: hidden;
}

.svg-icon.currentColor {
  stroke: currentColor;
}
</style>